import React from 'react'
import { Icon, Dropdown, Menu } from 'antd'
import SVGIcon from "components/SVGIcon";
import {messages} from "share/common";
import Condition from 'components/condition'
const { If } = Condition;

class CardTitle extends React.Component {
  constructor(props) {
    super(props);
    this.state = {
      title: '',
      key: '',
      subTitle: ''
    }
  }

  componentWillMount() {
    this.setState({
      title: this.props.title,
      key: this.props.cardKey,
      subTitle: this.props.subTitle
    })
  }

  componentWillReceiveProps(nextProps) {
    this.setState({
      title: nextProps.title,
      key: nextProps.cardKey,
      subTitle: nextProps.subTitle
    })
  }

  menu = (key) => {
    return (
      <Menu key={key}>
        <Menu.Item>
          <a onClick={() => this.props.reloadModule(key)}><Icon type="reload"/>{messages('dashboard.key143')/*刷新*/}</a>
        </Menu.Item>
        {this.props.removable &&
          <Menu.Item>
            <a onClick={() => this.props.removeModule(key)}><Icon type="close"/>{messages('dashboard.key144')/*移除*/}</a>
          </Menu.Item>}
      </Menu>
    )
  }

  render() {
    const {title, key, subTitle} = this.state;
    return (
      <div className="card-title">
        {title}
        <div className="card-more">
          <Dropdown overlay={this.menu(key)} placement="bottomRight">
            <a className="ant-dropdown-link" href="javascript:void(0)">
              <SVGIcon type="more" style={{fontSize: "20px"}}/>
            </a>
          </Dropdown>
        </div>
        <If value={subTitle}>
          <div className="card-sub-title">
            {subTitle}
          </div>
        </If>
        {this.props.children}
      </div>
    )
  }
}

CardTitle.propTypes = {
  title: React.PropTypes.string.isRequired, //卡片头标题
  cardKey: React.PropTypes.string.isRequired,  //卡片key值
  subTitle: React.PropTypes.string, //卡片头副标题
  removable: React.PropTypes.bool, //是否可移除卡片
  reloadModule: React.PropTypes.func.isRequired,
  removeModule: React.PropTypes.func.isRequired,
};

CardTitle.defaultProps={
  title: "",
  key: "",
  removable: true
};

export default CardTitle
